<template>
   <!-- 输入框 -->
  <header class="header">
    <h1>小黑记事本</h1>
    <!-- 子传父 -->
    <!-- 按回车 和点击都会进行添加 -->
    <input @keyup.enter="add" placeholder="请输入任务" class="new-todo" v-model="newMsg"/>
    <button class="add" @click="add">添加任务</button>
  </header>
</template>

<script>
export default {
  data(){
    return{
      newMsg:''
    }
  },
 methods:{
  add(){
    // console.log(this.newMsg);//this.newMsg 就是我输入的值
    // 要把输入的值传给App.vue
    // 非空判断
    if(this.newMsg.trim()==='')return alert('不能为为空，请重新输入')
    // 事件名 传的值
    this.$emit('addTask',this.newMsg)
    // 添加完成后 清空表单
    this.newMsg=''
  }
 }
}
</script>

<style>

</style>